/*
 * @Description: 流程中心骨架屏
 * @Author: seadon
 * @LastEditors: seadon
 * @Date: 2021-07-22 11:55:34
 * @LastEditTime: 2021-08-08 19:17:44
 */
import { defineComponent } from 'vue'
import { ContentLoader } from 'vue-content-loader'

const TabSkeleton = defineComponent({
	name: 'tab-skeleton',
	render() {
		return (
			<ContentLoader viewBox="0 0 1366 47">
				<rect x="0" y="5" rx="3" ry="3" width="96" height="27" />
				<rect x="126" y="5" rx="3" ry="3" width="105" height="27" />
				<rect x="261" y="5" rx="3" ry="3" width="105" height="27" />
				<rect x="396" y="5" rx="3" ry="3" width="125" height="27" />
				<rect x="551" y="5" rx="3" ry="3" width="105" height="27" />
				<rect x="686" y="5" rx="3" ry="3" width="105" height="27" />
			</ContentLoader>
		)
	},
})

const DropCheckSkeleton = defineComponent({
	name: 'drop-check-skeleton',
	render() {
		return (
			<ContentLoader viewBox="0 0 236 32">
				<rect x="0" y="0" rx="4" ry="4" width="220" height="100%" />
			</ContentLoader>
		)
	},
})
export { TabSkeleton, DropCheckSkeleton }
